import { Component } from '@angular/core';
import { VersionChildComponent } from '../version-child/version-child.component';
import { CommonModule } from '@angular/common';
@Component({
  selector: 'app-version-parent',
  standalone: true,
  imports: [VersionChildComponent, CommonModule],
  template: `
    <h2>Source code version</h2>
    <div>
      <button type="button" (click)="newMinor()">New minor version</button>
      {{ major }}
    </div>
    <div>
      <button type="button" (click)="newMajor()">New major version</button>
      {{ minor }}
    </div>
    <div>
      <app-version-child [major]="major" [minor]="minor"></app-version-child>
    </div>
    <div>
      <h2>Should mankind colonize the Universe?</h2>
      <h3>Agree: {{ agreed }}, Disagree: {{ disagreed }}</h3>

      <app-version-child
        *ngFor="let voter of voters"
        [name]="voter"
        (voted)="onVoted($event)"
      >
      </app-version-child>
    </div>
  `,
  styleUrls: ['./version-parent.component.css'],
})
export class VersionParentComponent {
  major = 1;
  minor = 23;
  agreed = 0;
  disagreed = 0;
  voters = ['Dr. IQ', 'Celeritas', 'Bombasto'];
  onVoted(agreed: boolean) {
    console.log('父组件监听到事件 param =', agreed);
    if (agreed) {
      this.agreed++;
    } else {
      this.disagreed++;
    }
  }
  newMinor() {
    this.minor++;
  }

  newMajor() {
    this.major++;
    this.minor = 0;
  }
}
